// 卷帘
$(window).scroll(function() {
    if ($(window).scrollTop() > 166) {
        $('.fixtop').slideDown(300, 'linear', function() {});
        blocked(0)
    } else {
        $('.fixtop').slideUp(300, 'linear', function() {});
    }
})

function blocked(emen) {
    $('.nav-l').eq(emen).hover(function() {
        $('.pu-secondnav-l').eq(emen).css('display', 'block');
        $('.pu-secondnav-l-ul ').eq(emen).hover(function() {
            $('.pu-secondnav-l').eq(emen).css('display', 'block');
            $('.pu-secondnav-secnav').hover(function() {
                $('.pu-secondnav-l').eq(emen).css('display', 'block');
            }, function() {
                $('.pu-secondnav-l').eq(emen).css('display', 'none');
            })
        }, function() {
            $('.pu-secondnav-l').eq(emen).css('display', 'none');
        })
    }, function() {
        $('.pu-secondnav-l').eq(emen).css('display', 'none');
    })
}
// 左侧跳楼效果

$('.floor').hide();
$(window).scroll(function() {
    if ($(window).scrollTop() < 666) {
        $('.floor').fadeOut(300, 'linear', function() {});
    } else if ($(window).scrollTop() >= 666) {
        $('.floor').fadeIn(300, 'linear', function() {});
        // 根据内容变换---自己页面自己判断
        // $('.now').each(function(index, value) {
        //     if ($(window).scrollTop() >= $('.now')[index].offsetTop) {
        //         $($('.active')[index]).addClass('flcolor').siblings().removeClass('flcolor')
        //         $($('.r-triangle')[index]).css('display','block').siblings().css('display','none')
        //     }
        // })
    }
})
$('.floor li:last').on('click', function() {
    $('html').animate({
        scrollTop: 0
    }, 1000)
})

// 右侧固定导航栏
// 解释说明部分
$('.explain').each(function(index, value) {
        $(value).hover(function(e) {
                $('.r-explain').css({
                    'visibility': 'hidden',
                    'left': '-121px'
                })
                $($('.r-explain')[index]).css({
                    'visibility': 'unset',
                    'left': '-90px'
                })

            },
            function(e) {
                $($('.r-explain')[index]).css({
                    'visibility': 'hidden',
                })
            })
    })
    // 返回顶部
$('.retop').click(function() {
    $('html').animate({
        scrollTop: 0
    }, 1000)
})

// 右侧固定栏右侧
$('.shoppingbtn').click(function(event) {
        $('.shoppingbtn .p-zero').css({
            backgroundColor: '#fff',
            color: '#f42424'
        })
        $(this.children).css('background', '#f42424')
        $('.r-sidebar-all').width(320);
        $('.toumingmask').css('display', 'block')
        $('.toumingmask').click(function(e) {
            $('.toumingmask').css('display', 'none')
            $('.shoppingbtn').children().css('background', '#000')
            $('.r-sidebar-all').width(40);
            $('.shoppingbtn .p-zero').css({
                backgroundColor: '#f42424',
                color: '#fff'
            })
            e.stopPropagation()
        })
        $('.ibar_closebtn').click(function() {
            $('.shoppingbtn').children().css('background', '#000')
            $('.r-sidebar-all').width(40);
            $('.shoppingbtn .p-zero').css({
                backgroundColor: '#f42424',
                color: '#fff'
            })
        })




        event.stopPropagation()
    })
    // 右侧固定栏购物车内容
$('.noN-lists').each(function(index, value) {
    $(value).html('');
    var noLis = `<li>
    <a href="###" class="noN-del">删除</a>
    <div class="noN-lists-img">
        <a href="###"><img src="../img/public-img/0_thumb_G_1490175189731.jpg" alt=""></a>
    </div>
    <div class="noN-lists-con">
        <a href="###">玛克家纺【12期免息】Panasonic/松下 SR-PE401-K 新品可变压力IH电饭煲4L 送豪华大礼</a>
        <div class="noN-ice">2299.00</div>
        <div class="noN-pu-Number">
            <button class="prev">-</button>
            <input type="text" value="1" id="noN-pu-num">
            <button class="next">+</button>
        </div>
    </div>
</li>`;
    $(value).append(noLis);

    $(value.children).hover(function() {
        $('.noN-del').show()
    }, function() {
        $('.noN-del').hide()
    })

    $(".p-zero").text(value.children.length);
    $('.shops-count>p>span').text(value.children.length);
    if (value.children.length == 0) {
        $(".shop-con-con").show();
        $(".shop-con-con").hide();
    } else {
        $(".shop-con-con").hide();
        $(".noNullList").show()
        $(".noN-list-bottom").show()
        $('.noN-lists').show()
    }

    $(".noN-del").on('click', function() {
        $(this).parent('li').remove();
        if (value.children.length == 0) {
            $(".noN-list-bottom").remove()
            $(".shop-con-con").show();
            $('.noN-lists').hide()
        }
        // console.log(value.children.length);
        $(".p-zero").text(value.children.length);
        $('.shops-count>p>span').text(value.children.length);
    })

})










// 中间左边侧导航
var puSecondnavArrL = [
    [
        // 左侧
        [
            // 左侧标
            ['品牌日', '家电城', '智能生活馆', '京东净化馆', '京东服务店', '值得买精选'],

            [
                // 左侧左列表
                ['厨房电器', '大家电', '个护健康', '五金家装', '生活电器'],
                // 左侧右列表
                [
                    ['电饭煲', '电压力锅'],
                    ['平板电视'],
                    ['按摩椅', '剃须刀'],
                    ['电动工具'],
                    ['电风扇', '冷风扇']
                ]
            ]
        ],
        // 右侧图片
        ["../img/public-img/banner-twonav1.jpg", "../img/public-img/banner-teonav2.jpg"]
    ],
    [
        // 左侧
        [
            // 左侧标
            ['男装', '女装', '内衣', '国际品牌'],

            [
                // 左侧左列表
                ['女装', '男装', '服饰配件', '内衣', '运动户外'],
                // 左侧右列表
                [
                    ['连衣裙'],
                    ['T恤'],
                    ['配饰', '棒球帽'],
                    ['内衣配饰'],
                    ['跑步运动', '舞蹈运动']
                ]
            ]
        ],
        // 右侧图片
        ["../img/public-img/banner-twonav1.jpg", "../img/public-img/banner-teonav2.jpg", "../img/public-img/banner-teonav2.jpg"]
    ],
    [
        // 左侧
        [
            // 左侧标
            ['男鞋', '女鞋', '箱包', '钟表', '奢侈品', '女包'],

            [
                // 左侧左列表
                ['奢侈品', '功能箱包', '流行男鞋', '时尚女鞋', '潮流女包'],
                // 左侧右列表
                [
                    ['箱包'],
                    ['旅行包'],
                    ['休闲鞋', '增高鞋'],
                    ['单鞋'],
                    ['手提包']
                ]
            ]
        ],
        // 右侧图片
        ["../img/public-img/banner-twonav1.jpg", "../img/public-img/banner-teonav2.jpg", "../img/public-img/banner-teonav2.jpg", "../img/public-img/banner-teonav2.jpg"]
    ],
    [
        // 左侧
        [
            // 左侧标
            ['手机频道', '网上营业厅', '配件城', '手机社区', '以旧换新'],

            [
                // 左侧左列表
                ['摄影图像', '手机通信', '手机配件'],
                // 左侧右列表
                [
                    ['数码相机'],
                    ['手机'],
                    ['蓝牙耳机', '保护套']
                ]
            ]
        ],
        // 右侧图片
        ["../img/public-img/banner-twonav1.jpg", "../img/public-img/banner-teonav2.jpg"]
    ],
    [
        // 左侧
        [
            // 左侧标
            ['本周热卖', '游戏部署', '智能社区', '装机大师'],

            [
                // 左侧左列表
                ['电脑整机', '电脑配件'],
                // 左侧右列表
                [
                    ['笔记本'],
                    ['硬盘']
                ]
            ]
        ],
        // 右侧图片
        ["../img/public-img/banner-twonav1.jpg", "../img/public-img/banner-teonav2.jpg"]
    ],
    [
        // 左侧
        [
            // 左侧标
            ['家装城', '居家日用', '精品家具', '家装建材', '厨房达人', '猫猫狗狗'],

            [
                // 左侧左列表
                ['家具', '厨具', '家访', '生活日用'],
                // 左侧右列表
                [
                    ['卧室家居', '客厅家具'],
                    ['烹饪锅具'],
                    ['床品套件', '棒球帽'],
                    ['浴室用品']
                ]
            ]
        ],
        // 右侧图片
        ["../img/public-img/banner-twonav1.jpg", "../img/public-img/banner-teonav2.jpg"]
    ],
    [
        // 左侧
        [
            // 左侧标
            ['清洁用品', '美妆商城'],

            [
                // 左侧左列表
                ['面部护肤', '洗发护发', '香水彩妆'],
                // 左侧右列表
                [
                    ['清洁'],
                    ['洗发'],
                    ['底妆', '腮红']
                ]
            ]
        ],
        // 右侧图片
        ["../img/public-img/banner-twonav1.jpg", "../img/public-img/banner-teonav2.jpg"]
    ]
];
// 获取数组里数据
// 封装
console.log($('.pu-secondnav').eq(0));

function secondNavFun(arr, targel) {
    // 获取图片src地址
    $('.pu-secondnav-secnav-r').eq(targel).html('');
    $('.secnav-l-t').eq(targel).html('')
    $('.secnav-l-m').eq(targel).html('')
    arr[1].forEach(function(value, index) {
        var rel1 = ` <div>
    <a href="# "><img src="${value} " alt=" "></a>
</div>`
        $('.pu-secondnav-secnav-r').eq(targel).append(rel1)
    });

    // 获取左边文字部分
    // 标题
    // console.log(puSecondnavArrL[0][1][1]);
    arr[0][0].forEach(function(value, index) {
        var rel2 = `<a href="#">${value}</a>`
        $('.secnav-l-t').append(rel2)
    });
    // 内容左侧
    var lSul = document.createElement('ul')
    lSul.className = "secnav-l-m-l"
    arr[0][1][0].forEach(function(value, index) {
        var rel3 = `
        <li><a href="# ">${value}</a></li>`
        lSul.innerHTML += rel3
            // 内容右侧
        var Sul = document.createElement('ul')
        Sul.className = "secnav-l-m-r"
        arr[0][1][1][index].forEach(function(value, index) {
            var rel5 = '';
            rel5 = ` 
        <li class="vertical "></li>
        <li><a href="# ">${value}</a></li>`
            Sul.innerHTML += rel5
        })
        $('.secnav-l-m').eq(targel).append(Sul)
    });
    $('.secnav-l-m').eq(targel).prepend(lSul)
}

// 根据li显示二级导航
function liblock(ele) {
    $('.pu-secondnav-l-ul').eq(ele).children('.pu-secondnav-l-li').each(function(index, value) {
        value.onmouseover = function() {
            secondNavFun(puSecondnavArrL[index], ele)
            $('.pu-secondnav-secnav').eq(ele).css('display', 'block');
            $('.pu-secondnav-secnav').eq(ele).hover(function() {
                    secondNavFun(puSecondnavArrL[index], ele)
                    $('.pu-secondnav-secnav').eq(ele).css('display', 'block')
                },
                function() {
                    $('.pu-secondnav-secnav').eq(ele).css('display', 'none')
                })
        }
        value.onmouseout = function() {
            $('.pu-secondnav-secnav').eq(ele).css('display', 'none')
        }
    })
}
liblock(0)
    // 下面
blocked(1)
liblock(1)


// city
var hideCityMidd = document.querySelector('.hide-city-midd')
var hideCityTop = document.querySelector('.hide-city-top')
var hideCityBots = document.querySelector('.hide-city-bots')
    // var hideCityBotCity = document.querySelectorAll('.hide-city-bot-city')
    // 热门城市添加
var hotCity = ['苏州市', '北京市', '天津市', '上海市']
hideCityTop.innerHTML = ''
hotCity.forEach(function(value, index) {
        var str = ''
        str = `<span class="span-city">${value}</span>`
        hideCityTop.innerHTML += str
    })
    //字母添加
var letterArr = ['A', 'B', 'C', ' D', ' E', ' F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'W', 'X', 'Y', 'Z']
hideCityMidd.innerHTML = ''
hideCityBots.innerHTML = ''
letterArr.forEach(function(value, index) {
        // 横排字母添加
        var str = ''
        str = `<span class="span-midd">${value}</span>`
        hideCityMidd.innerHTML += str
            // 竖排字母添加
        var str1 = ''
        str1 = `<li>
        <span class="span-midds">${value}</span>
        <div class="hide-city-bot-city">
        </div>
        </li>`
        hideCityBots.innerHTML += str1
    })
    //城市添加
var sity = [
    ['阿拉善盟', '鞍山市', '安庆市', '安阳市', '安顺市', '阿里地区'],
    ['保定市', '包头市', '巴彦淖尔市', '本溪市', '白山市', '白城市'],
    ['承德市', '沧州市', '长沙市', '常德市', '赤峰市', '朝阳市', '长春市', '常州市'],
    ['定州市', '大同市', '大连市', '丹东市', '大庆市', '大兴安岭地区', '东营市', '德州市', '东莞市'],
    ['鄂尔多斯市', '鄂州市', '恩施土家族苗族自治区'],
    ['抚顺市', '阜新市', '阜阳市', '福州市', '抚州市', '佛山市', '防城港市'],
    ['赣州市', '广州市', '桂林市', '贵港市', '广元市', '广安市', '甘孜藏族自治州'],
    ['邯郸市', '衡水市', '呼和浩特市', '呼伦贝尔市', '葫芦岛市'],
    ['晋城市', '晋中市', '锦州市', '吉林市', '鸡西市', '佳木斯市', '嘉兴市', '金华市'],
    ['开封市', '昆明市', '克拉玛依市', '喀什地区', '可克达拉市', '昆玉市'],
    ['廊坊市', '临汾市', '吕梁市', '辽阳市', '辽源市', '连云港市', '丽水市', '六安市', '龙岩市'],
    ["马鞍山", "茂名", "眉山", "梅州", "绵阳", "牡丹江"],
    ["南京", "南昌", "南宁", "宁波", "南充", "南平", "南通", "南阳", "那曲", "内江", "宁德", "怒江"],
    ["盘锦", "攀枝花", "平顶山", "平凉", "萍乡", "莆田", "濮阳"],
    ["青岛", "黔东南", "黔南", "黔西南", "庆阳", "清远", "秦皇岛", "钦州", "齐齐哈尔", "泉州", "曲靖", "衢州"],
    ["日喀则", "日照"],
    ["上海", "深圳", "苏州", "沈阳", "石家庄", "三门峡", "三明", "三亚", "商洛", "商丘", "上饶", "山南", "汕头", "汕尾", "韶关", "绍兴", "邵阳", "十堰", "朔州", "四平", "绥化", "遂宁", "随州", "宿迁", "宿州"],
    ["天津", "太原", "泰安", "泰州", "台州", "唐山", "天水", "铁岭", "铜川", "通化", "通辽", "铜陵", "铜仁", "台湾"],
    ["武汉", "乌鲁木齐", "无锡", "威海", "潍坊", "文山", "温州", "乌海", "芜湖", "乌兰察布", "武威", "梧州"],
    ["厦门", "西安", "西宁", "襄樊", "湘潭", "湘西", "咸宁", "咸阳", "孝感", "邢台", "新乡", "信阳", "新余", "忻州", "西双版纳", "宣城", "许昌", "徐州", "香港", "锡林郭勒", "兴安"],
    ["银川", "雅安", "延安", "延边", "盐城", "阳江", "阳泉", "扬州", "烟台", "宜宾", "宜昌", "宜春", "营口", "益阳", "永州", "岳阳", "榆林", "运城", "云浮", "玉树", "玉溪", "玉林"],
    ["杂多县", "赞皇县", "枣强县", "枣阳市", "枣庄", "泽库县", "增城市", "曾都区", "泽普县", "泽州县", "札达县", "扎赉特旗", "扎兰屯市", "扎鲁特旗", "扎囊县", "张北县", "张店区", "章贡区", "张家港", "张家界", "张家口", "漳平市", "漳浦县", "章丘市", "樟树市", "张湾区", "彰武县", "漳县", "张掖", "漳州", "长子县", "湛河区", "湛江", "站前区", "沾益县", "诏安县", "召陵区", "昭平县", "肇庆", "昭通", "赵县", "昭阳区", "招远市", "肇源县", "肇州县", "柞水县", "柘城县", "浙江", "镇安县", "振安区", "镇巴县", "正安县", "正定县", "正定新区", "正蓝旗", "正宁县", "蒸湘区", "正镶白旗", "正阳县", "郑州", "镇海区", "镇江", "浈江区", "镇康县", "镇赉县", "镇平县", "振兴区", "镇雄县", "镇原县", "志丹县", "治多县", "芝罘区", "枝江市", "芷江侗族自治县", "织金县", "中方县", "中江县", "钟楼区", "中牟县", "中宁县", "中山", "中山区", "钟山区", "钟山县", "中卫", "钟祥市", "中阳县", "中原区", "周村区", "周口", "周宁县", "舟曲县", "舟山", "周至县", "庄河市", "诸城市", "珠海", "珠晖区", "诸暨市", "驻马店", "准格尔旗", "涿鹿县", "卓尼", "涿州市", "卓资县", "珠山区", "竹山县", "竹溪县", "株洲", "株洲县", "淄博", "子长县", "淄川区", "自贡", "秭归县", "紫金县", "自流井区", "资溪县", "资兴市", "资阳"],
]
var hideCityBotCity = document.querySelectorAll('.hide-city-bot-city')
for (var i = 0; i < sity.length; i++) {
    for (var j = 0; j < sity[i].length; j++) {
        var str = ''
        str = ` <span class="span-citys">${sity[i][j]}</span>`
        hideCityBotCity[i].innerHTML += str
    }
}

var spanMidd = document.querySelectorAll('.span-midd')
var spanMidds = document.querySelectorAll('.span-midds')
spanMidd.forEach(function(value, index) {
    value.onmouseenter = function() {
        value.style.color = 'red'
        $('.hide-city-bot').animate({
                scrollTop: spanMidds[index].offsetTop + 0
            }, 50)
            // moveAnimate11(hideCityBots, mmmm)

    }
    value.onmouseleave = function() {
        value.style.color = '#8C8C8C'
    }
})
$('.t-f-l').hover(function() {
        $('.hide-city').css('display', 'block');
        $('.hide-city').hover(function() {
            $('.hide-city').css('display', 'block');
        }, function() {
            $('.hide-city').css('display', 'none');
        })
    },
    function() {
        $('.hide-city').css('display', 'none')
    })